import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import AutoImport from 'unplugin-auto-import/vite';
import path from 'path';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue({
      // $ref\$computed配置
      reactivityTransform: true,
    }),
    // 插件，自动引入ref onMounted等
    AutoImport({
      imports: ['vue', 'vue-router', 'vuex'],
    }),
    vueJsx(),
  ],
  resolve: {
    // 引入别名
    alias: {
      '@': path.resolve(__dirname, 'src'),
    },
  },
  css: {
    //* css模块化
    modules: {
      // css模块化 文件以.module.[css|less|scss]结尾
      generateScopedName: '[name]__[local]___[hash:base64:5]',
      hashPrefix: 'prefix',
    },
    preprocessorOptions: {
      scss: {
        // 可以在此引入sass样式文件
        additionalData: '',
        // 支持内联 JavaScript
        javascriptEnabled: true,
      },
      less: {
        javascriptEnabled: true,
      },
    },
  },
  build: {
    outDir: 'new-feature', //输出文件名称
    lib: {
      entry: path.resolve(__dirname, 'src/components/index.js'), //指定公共组件编译入口文件
      name: 'new-feature',
      fileName: 'new-feature',
    }, //库编译模式配置
    rollupOptions: {
      external: ['vue'], // 确保外部化处理那些你不想打包进库的依赖
      // 整理打包后的文件名
      output: {
        globals: {
          vue: 'Vue',
        },
      },
    },
  },
});
